<template>
        <el-card shadow="never" style="max-height: 700px; overflow: auto">
            <el-form ref="form" :model="form" :rules="rules" label-width="90px" :disabled="disabled">
                <el-form-item label="id:" prop="id" v-show="false">
                    <el-input v-model="form.id" disabled />
                </el-form-item>
                <el-form-item label="plat_account:" prop="plat_account" v-show="false">
                    <el-input v-model="form.plat_account" disabled />
                </el-form-item>
                <el-form-item label="花费:" prop="cost">
                    <el-input-number v-model="form.cost" :step="0.01" :min="0"></el-input-number>
                </el-form-item>
                <el-form-item label="cpc:" prop="cpc">
                    <el-input v-model="form.cpc" :step="0.01" :min="0"></el-input>
                </el-form-item>
                <el-form-item label="click:" prop="click">
                    <el-input v-model="form.click" :step="0.01" :min="0"></el-input>
                </el-form-item>
                <el-form-item label="平台:" prop="plat">
                    <SelectPage v-model="form.plat" :url="'/admin/advplatform/index'" show_field="title" placeholder="请选择平台" query_field="title" :multiple="false" />
                </el-form-item>
                <el-form-item label="广告账户:" prop="plat_account">
                    <SelectPage @click="account_change" v-model="form.plat_account" :url="'/admin/advplat/index'" show_field="site_name" placeholder="请选择广告账户" query_field="site_name" :multiple="false" />
                </el-form-item>

                <el-form-item label="添加人:" prop="admin_id">
                    <SelectPage v-model="form.admin_id" :url="'/admin/system.admin/selectPage'" show_field="nickname" query_field="nickname" :multiple="false" />
                </el-form-item>
                <!-- <el-form-item label="广告账户" prop="plat_account">
                <SelectPage v-model="form.plat_account" :url="'/admin/site/selectPage'" show_field="site_name" placeholder="请选择站点" query_field="site_name" :multiple="false" />
                </el-form-item> -->
                <el-form-item label="美国日期:" prop="create_time">
                    <el-date-picker
                        v-model="form.create_time"
                        align="right"
                        type="date"
                        placeholder="选择日期"
                        >
                    </el-date-picker>
                    <span style="color:brown;font-size: 14px;">（请选择美国日期）当前美国时间{{ us_time | parseTime('y-m-d h:i:s 星期a') }}</span>
                </el-form-item>
                <!-- <el-form-item
                    v-for="(domain, index) in form.domains"
                    :label="'账号' + index"
                    :key="index"
                    :prop="'domains.' + index + '.value'"
                    :rules="{
                    required: true, message: '账号不能为空', trigger: 'blur'
                    }"
                >
                <el-row>
                    <el-col :span="18">
                        <el-input v-model="domain.value"></el-input>
                    </el-col>
                    <el-col :span="6">
                        <el-button type="danger" @click.prevent="removeDomain(domain)">删除</el-button>
                    </el-col>
                </el-row>
                    
                </el-form-item> -->
                
                <!-- <el-form-item>
                    <el-button @click="addDomain">新增账号</el-button>
                </el-form-item> -->

                <el-form-item>
                    <el-button type="primary" @click="submitForm">确认 </el-button>
                    <el-button type="warning" @click="cancel">取消 </el-button>
                </el-form-item>
            </el-form>
        </el-card>
</template>

<script>
export default {
    name: 'EditForm',
    props: {
        findFormData: {
            type: Object,
            default: {}
        },
        editFormParams: {
            type: Object,
            default: {}
        },
        // 表单是否禁用
        disabled: {
            type: Boolean,
            default: false,
        },
        
    },
    data() {
        return {
            pickerOptions: {
                disabledDate(time) {
                    return time.getTime() > Date.now();
                },
                shortcuts: [{
                    text: '今天',
                    onClick(picker) {
                    picker.$emit('pick', new Date());
                    }
                }, {
                    text: '昨天',
                    onClick(picker) {
                    const date = new Date();
                    date.setTime(date.getTime() - 3600 * 1000 * 24);
                    picker.$emit('pick', date);
                    }
                }, {
                    text: '一周前',
                    onClick(picker) {
                    const date = new Date();
                    date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                    picker.$emit('pick', date);
                    }
                }]
            },
            // domains: [
            //     {
            //         value: '',
            //         key: '1',
            //     },
            //     {
            //         value: '',
            //         key: '2',
            //     },
            //     {
            //         value: '',
            //         key: '3',
            //     },
            //     {
            //         value: '',
            //         key: '4',
            //     },
            //     {
            //         value: '',
            //         key: '5',
            //     },
            // ],
            // 编辑表单验证规则
            rules: {
                cost: [{ required: true, message: "请输入花费", trigger: "blur" }],
                plat: [{ required: true, message: "请输入平台", trigger: "blur" }],
                create_time: [{ required: true, message: "请输入日期", trigger: "blur" }],
            },
            form: {  
                // domains: [
                //     {
                //         value: '',
                //         key: '1',
                //     },
                //     {
                //         value: '',
                //         key: '2',
                //     },
                //     {
                //         value: '',
                //         key: '3',
                //     },
                //     {
                //         value: '',
                //         key: '4',
                //     },
                //     {
                //         value: '',
                //         key: '5',
                //     },
                // ],
                create_time:'',
            },
            us_time:0,
        }
    },
    watch: {
        findFormData: {
            handler(nval) {
                const create_time = new Date();
                create_time.setTime(create_time.getTime() - 3600 * 1000 * 24);
                this.form.create_time = create_time
                if (JSON.stringify(nval) != '{}') {
                    this.$nextTick(() => {
                        this.form = nval
                        // if(this.form.domains == '' || this.form.domains == undefined){
                        //     this.form.domains = this.domains
                        // }
                    })
                }
            },
            immediate: true,
            deep: false,
        },
        
    },
    created() {
        this.now()
    },
    methods: {
        account_change(val) {
            console.log('val',val);
        },
        now() {
            this.us_time = new Date().getTime() - 15 * 3600 * 1000;
            setInterval(() => {
                this.us_time = new Date().getTime() - 15 * 3600 * 1000;
            }, 1000)
        },
        // removeDomain(item) {
        //     var index = this.form.domains.indexOf(item)
        //     if (index !== -1) {
        //     this.form.domains.splice(index, 1)
        //     }
        // },
        // addDomain() {
        //     this.form.domains.push({
        //     value: '',
        //     key: Date.now()
        //     });
        // },
        // 取消按钮
        cancel() {
            this.$emit('editFormCancel')
        },

        submitForm() {
            this.$refs['form'].validate((valid, obj) => {
                if (valid) {
                    let formcreate_time = this.form.create_time;
                    formcreate_time = new Date(formcreate_time);
                    this.form.create_times = formcreate_time.getTime()
                    this.$emit('submitForm', this.form)
                }
            })
        },

        // 表单重置
        reset() {
            this.resetForm('form')
        }
    }
}
</script>
